import 'dart:math';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:pull_to_refresh_flutter3/pull_to_refresh_flutter3.dart';
import 'package:search_people/entrance/route/routes.dart';
import 'package:search_people/utils/component/list/table_view.dart';
import '../../value/topcolors.dart';
import 'logic.dart';

class SearchPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final logic = Get.put(SearchLogic());
    final state = Get.find<SearchLogic>().state;

    return Scaffold(
      backgroundColor: Color(0xffF0F2F5),
      appBar: AppBar(
        titleSpacing: 0,
        leadingWidth: 0,
        backgroundColor: Colors.white,
        elevation: 0,
        title: Container(
          color: Colors.white,
          child: Row(
            children: [
              Expanded(
                  child: Hero(
                tag: 'search',
                child: Container(
                  margin: EdgeInsets.only(left: 15),
                  height: 40,
                  child: TextField(
                    cursorColor: TopColors.main_color,
                    cursorWidth: 3,
                    controller: state.textEditingController,
                    style: TextStyle(fontSize: 14.sp),
                    onChanged: (str) => logic.searchKey(str),
                    onSubmitted: (str) => logic.inHis(str),
                    textInputAction: TextInputAction.search,
                    maxLines: 1,
                    decoration: InputDecoration(
                      contentPadding: EdgeInsets.zero,
                      hintText: '请输入关键词',
                      hintStyle: TextStyle(fontSize: 15.r),
                      // prefixIconConstraints: BoxConstraints(maxWidth: 15,maxHeight: 15,minHeight: 15,minWidth: 15,),
                      // prefixIcon: Image.asset('images/icon_search_hui.png'),
                      prefixIcon: Icon(
                        CupertinoIcons.search,
                        size: 18.r,
                      ),
                      border: OutlineInputBorder(
                        borderSide:
                            BorderSide(width: 1, color: TopColors.main_color),
                      ),
                      enabledBorder: OutlineInputBorder(
                          borderSide:
                              BorderSide(width: 1, color: TopColors.main_color),
                          borderRadius: BorderRadius.all(Radius.circular(4.r))),
                      focusedBorder: OutlineInputBorder(
                          borderSide:
                              BorderSide(width: 1, color: TopColors.main_color),
                          borderRadius:
                              BorderRadius.all(Radius.circular(20.r))),
                      filled: true,
                      fillColor: Colors.white,
                    ),
                  ),
                ),
              )),
              TextButton(
                child: Text(
                  '取消',
                  style: TextStyle(fontSize: 14.sp, color: TopColors.black_33),
                ),
                onPressed: () {
                  Get.back();
                },
              )
            ],
          ),
        ),
      ),
      body: GetBuilder<SearchLogic>(
        builder: (logic) {
          return SafeArea(
              child: state.keywords == ''
                  ? Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Container(
                          margin: EdgeInsets.all(15),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Visibility(
                                visible: state.strHis.isNotEmpty,
                                child: Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Container(
                                      margin: EdgeInsets.only(bottom: 12),
                                      child: Row(
                                        children: [
                                          Expanded(
                                              child: Text(
                                            '搜索历史',
                                            style: TextStyle(
                                                color: Color(0xff888888),
                                                fontSize: 13.sp),
                                          )),
                                          GestureDetector(
                                            child: Image.asset(
                                              'assets/images/search/icon_delete.png',
                                              width: 15.r,
                                              height: 15.r,
                                            ),
                                            onTap: () =>
                                                logic.deleteHis(context),
                                          )
                                          // Icon(Icons.delete_forever_outlined,color: Color(0xffbbbbbb),size: 16,)
                                        ],
                                      ),
                                    ),
                                    Wrap(
                                      children: state.histroyWidget,
                                    ),
                                  ],
                                ),
                              ),
                              Container(
                                decoration: BoxDecoration(
                                    borderRadius: BorderRadius.only(
                                        topRight: Radius.circular(4),
                                        topLeft: Radius.circular(4)),
                                    gradient: LinearGradient(
                                      begin: Alignment.topCenter,
                                      end: Alignment.bottomCenter,
                                      colors: [
                                        Color(0xffFFF1DE),
                                        Color(0xffffffff),
                                      ],
                                    )),
                                padding: EdgeInsets.all(10),
                                width: MediaQuery.of(context).size.width,
                                margin: EdgeInsets.only(top: 16),
                                child: Row(
                                  children: [
                                    Container(
                                      child: Image.asset(
                                        'assets/images/search/icon_hot.png',
                                        width: 14.r,
                                        height: 14.r,
                                      ),
                                      margin: EdgeInsets.only(right: 10),
                                    ),
                                    Text(
                                      '热搜人物',
                                      style: TextStyle(
                                          color: Color(0xff9D7047),
                                          fontSize: 15.sp),
                                    )
                                  ],
                                ),
                              ),
                              Container(
                                decoration: const BoxDecoration(
                                  color: Colors.white,
                                  borderRadius: BorderRadius.only(
                                      bottomLeft: Radius.circular(4),
                                      bottomRight: Radius.circular(4)),
                                ),
                                child: ListView.separated(
                                  itemBuilder: (context, index) {
                                    return GestureDetector(
                                      onTap: () {
                                        Get.toNamed(RouterPath.person_detail,
                                            arguments:
                                                state.hots[index].leaderId);
                                      },
                                      child: Container(
                                        margin: EdgeInsets.all(8.r),
                                        child: Row(
                                          children: [
                                            logic.getIndexWidge(index),
                                            Expanded(
                                                child: RichText(
                                                    text: TextSpan(
                                                        text: state.hots[index]
                                                                .leaderName ??
                                                            '',
                                                        style: TextStyle(
                                                            color: TopColors
                                                                .black_33,
                                                            fontSize: 14.r),
                                                        children: <TextSpan>[
                                                  TextSpan(
                                                      text:
                                                          '\t\t${state.hots[index].currentPosition}',
                                                      style: TextStyle(
                                                          color: TopColors
                                                              .black_66,
                                                          fontWeight:
                                                              FontWeight.normal,
                                                          fontSize: 11.r)),
                                                ])))
                                          ],
                                        ),
                                      ),
                                    );
                                  },
                                  itemCount: state.hots.length,
                                  shrinkWrap: true,
                                  physics: const NeverScrollableScrollPhysics(),
                                  separatorBuilder:
                                      (BuildContext context, int index) {
                                    return Container(
                                      margin: EdgeInsets.only(
                                          left: 35.r, right: 10.r),
                                      child: const Divider(
                                        height: 1,
                                        color: Color(0xffeeeeee),
                                      ),
                                    );
                                  },
                                ),
                              )
                            ],
                          ),
                        )
                      ],
                    )
                  : Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Container(
                            margin: EdgeInsets.only(
                                left: 15.r, top: 10.r, bottom: 3.r),
                            child: RichText(
                                text: TextSpan(
                                    text: '搜索到',
                                    style: TextStyle(color: TopColors.black_33),
                                    children: <TextSpan>[
                                  TextSpan(
                                      text: state.serchList?.total.toString() ??
                                          '',
                                      style: TextStyle(
                                          color: Colors.blueAccent,
                                          fontWeight: FontWeight.bold)),
                                  TextSpan(
                                      text: '个结果',
                                      style:
                                          TextStyle(color: TopColors.black_33)),
                                ]))),
                        Expanded(
                          child: SmartRefresher(
                            controller: state.refreshController,
                            // header: RefreshHeaderFooter.classicHeader(),
                            // header: RefreshHeaderFooter.customHeader(topInset: refreshTopInset),
                            // footer: RefreshHeaderFooter.classicFooter(),
                            // onRefresh: logic.searchKey(key),
                            onLoading: logic.loadMore,
                            enablePullDown: false,
                            enablePullUp: true,
                            child: TableView(data: state.resultList),
                          ),
                        )
                      ],
                    ));
        },
      ),
    );
  }
}
